<template>
  <div id="cesium-container"></div>
</template>

<script setup>
import { onMounted, onBeforeUnmount } from 'vue'
import { useCesiumStore } from '@/stores/cesiumStore'
// 使用 Cesium Store
const cesiumStore = useCesiumStore()
onMounted(() => {
  // 初始化 Cesium Viewer
  cesiumStore.initViewerCesium('cesium-container')
})

onBeforeUnmount(() => {
  // 销毁 Cesium Viewer
  cesiumStore.destroyViewerCesium()
})
</script>

<style lang="scss" scoped>
#cesium-container {
  width: 100%;
  height: 100%;
}
//去除水印 //版权信息和logo
:deep(.cesium-viewer-bottom) {
  display: none;
}
:deep(.cesium-viewer-toolbar) {
  position: absolute;
  top: 90px;
  right: 10px;
}
:deep(.cesium-infoBox) {
  position: absolute;
  top: 130px;
  right: 10px;
}
</style>
